<template>
  <div class="login">
    <!-- <router-link :to="{name:'index'}">index</router-link> -->
    <div class="logo">
      <i class="iconfont">&#xe64a;</i>
      <p>还记得儿时的梦吗？</p>
    </div>
    <div class="main">
      <div class="form">
        <ul>
          <li class="input">
            <input type="number" placeholder="手机号码" v-model="form.phone" />
            <qyb-gt @smsCodeSucess="sendSms">
              <i class="sentMsg">发送验证码</i>
            </qyb-gt>
          </li>
          <li class="input">
            <input type="text" v-model="form.code" placeholder="验证码" />
          </li>
          <li class="input">
            <input type="password" v-model="form.password" placeholder="登录密码" />
          </li>
        </ul>
        <button @click="registerAction">注册</button>
        <div class="register">
          <router-link :to="{ name: 'login'}">已注册？去登录</router-link>
        </div>
      </div>
      <div class="foot">
        <router-link :to="{ name: 'forget'}">忘记密码？</router-link>
      </div>
    </div>
  </div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
export default {
  data() {
    return {
      captchaObj: null,
      phone: "",
      form: {
        phone: "",
        code: "",
        password: ""
      }
    };
  },
  async mounted() {
    console.log("login_mounted");
  },
  computed: {
    ...mapGetters({
      hehe: "getHeHe",
      gg: "a/getGG"
    })
  },

  watch: {
    $route() {
      console.log("logins");
    }
  },
  methods: {
    ...mapActions(["setHeHe", "a/setGG"]),
    async registerAction() {
      let result = await this.$http.post("/api/user/register", {
        username: this.form.phone,
        code: this.form.code,
        password: this.form.password
      });
      if (result.status == 1) {
        Cookies.set("passport", result.data.sessId, {
          expires: 60
        });
        let joinUrl = localStorage.getItem("url--join");
        if (joinUrl == undefined) {
          this.$router.push({
            name: "index"
          });
        } else {
          localStorage.removeItem("url--join");
          window.location.href = joinUrl;
        }
      }
      // "4c53895dbded632bc47ed14b6544be7ebdaad59d"
    },
    async sendSms(success) {
      if (success) {
        let result = await this.$http.get("/api/app/sms", {
          params: {
            phone: this.form.phone,
            type: "register"
          }
        });
        if (result) {
          console.log("发送成功");
          alert("验证码是:" + result.data.code);
        }
      }
    },
    inputTest() {
      console.log(11);
    },
    hehea() {
      console.log(1);

      this.inputValue = "2";
    },
    ceshi() {
      this.setHeHe(+new Date());
      this["a/setGG"]((Math.random() * 100) % 50);
      this.$router.push({
        name: this.$route.name,
        query: {
          hehe: 1
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
@import "./index.scss";
</style>
